<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Homepage</title>
<link href="css/style.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="css/menu.css"/>
<link rel="stylesheet" type="text/css" href="css/button.css"/>
<script type="text/javascript">
function SelectText(id)
		{
			document.getElementById(id).focus();
			document.getElementById(id).select();
		}
	var i = 0;
	window.setInterval(function() {
		document.getElementById("bannerImg").src = "images/banner"+i+".jpg";
		i++;
		if (i==5) i = 0;
	}, 3000);
function MM_jumpMenu(targ,selObj,restore){ //v3.0
  eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
  if (restore) selObj.selectedIndex=0;
}
</script>

</head>
<body>
	<div id="container">
    	<div id="header">
        	<div id="logo">
            	<img src="images/logo_top.gif" width="500" height="62" alt="logo" />
            </div>
            <div id="login">
				<br/><span class="loginText">Username</span>
                <input id="txtUsername" onclick="SelectText('txtUsername')" name="txtUsername" type="text" maxlength="20" width="100px" value="Type in your username"/>
				<br/><span class="loginText">Password</span>
                <input id="txtPassword" onclick="SelectText('txtPassword')" name="txtPassword" type="password" maxlength="20" width="100px" value="Password"/>
                <br/>
                <a class="linkLoginText" style="width:50px;" href="login.html">Login</a>
                <a class="linkLoginText" style="width:135px;" href="#">Forgot password?</a>
                <a class="linkLoginText" style="width:40px;" href="#">Register</a>
            </div>
    		</div>
        <div id="banner">
       	  <img src="images/banner2.jpg" name="bannerImg" width="760" height="210" id="bannerImg" />
        </div>
		<div id="menu">
        	<ul class="navigation">
                <li class="current"><a href="index.html"><em class="home"></em><b>Home</b></a></li>
                <li><a href="#"><em class="templates"></em><b>News</b></a></li>
                <li><a href="user.html"><em class="psd"></em><b>User</b></a></li>
                <li><a href="catalogue.html"><em class="tutorials"></em><b>Catalogue</b></a></li>
                <li><a href="shoppingcart.html"><em class="shop"></em><b>Shopping cart</b></a></li>
                <li><a href="#"><em class="contact"></em><b>Contact Us</b></a></li>
            </ul>
      </div>
      <div id="main" style="float:left;">
         <div class="left">
         	<div class="searchDiv">
        	<span class="searchText" style="padding:20px; width:100%;">SEARCH CAR</span>
            <div style="float:left; width:100%">
            <form name="form" id="form">
                	<div style="padding-right: 30px;float:right">
                    <font color="#FFFFFF">Model</font>
                    <select name="jumpMenu" id="jumpMenu" style="width:100px">
                            <option>Any model</option>
                            <option>model 1</option>
                            <option>model 2</option>
                            <option>model 3</option>
                          </select></div>
                    <div style="padding-right:30px;float:right">
                    <font color="#FFFFFF">Location</font>
                    <select name="jumpMenu" id="jumpMenu" style="width:100px">
                            <option>Any location</option>
                            <option>model 1</option>
                            <option>model 2</option>
                            <option>model 3</option>
                          </select></div>
                    <div style="padding-right:30px;float:right">
                    <font color="#FFFFFF">Brand</font>
                    <select name="jumpMenu" id="jumpMenu" style="width:100px">
                            <option>Any brand</option>
                            <option>model 1</option>
                            <option>model 2</option>
                            <option>model 3</option>
                          </select></div>
                    <div style="padding: 20px 40px 5px;float:right;">
                    	<button class="rounded" style="width:100px;"><span>Search</span></button></div>
                  </form>
             </div>
        	</div>
        	<div class="searchDiv">
                <span class="searchText" style="padding:20px; width:100%;">LASTEST NEWS</span><br/>
                    <div class="news">
                        <img src="images/hot-girl-with-racing-car.jpg" style="padding-left:20px" width="100" height="50" /> <br/>
                        abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc ababc abc abc abc abc...<br/>
                        <a href="#" class="loginText" style="float:right; padding-right:20px">Read more...</a> <br/>
                    </div>
          	</div>
          </div>
      		<div class="right">
            	<span class="searchText" style="padding:20px; width:100%;">ABOUT US</span><br/>
                abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abcabc abc abc abc abcabc abc abc abc abcabc abc abc abc abcabc abc abc abc abc <br/>
                abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc <a href="#" class="loginText" style="float:right">Read more...</a> <br/>
                <span class="searchText" style="padding:20px; width:100%;">CONTACT US</span><br/>
                abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abcabc abc abc abc abc abcabc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc abc <a href="#" class="loginText" style="float:right">Read more...</a> <br/>
        </div>

      <div id="sub" style="width:100%;height:280px;">
      		<div class="searchText" style="width:100%">Newest car</div>
      		<div id="item" style="width:20%;margin:2%;float:left;">
       	    	<img src="images/Racing Car.jpg" width="100%" height="100"/>
                <div class="item_info">
                	<span class="searchText" style="font-size:14px;margin-top:10px;">Car's info</span><br/>
                	Model: RS - X
                    Top Speed: 220km/h
                    <div style="width:100%;">
                            <a class="shoppingText" style="width:50%" href="#">Add to cart</a>|
                            <a class="shoppingText" style="width:40%;float:right" href="cartDetails.html">Details</a>
                        </div>
                </div>
           </div>
           <div id="item" style="width:20%;margin:2%;float:left;">
       	    	<img src="images/Racing Car.jpg" width="100%" height="100"/>
                <div class="item_info">
                	<span class="searchText" style="font-size:14px;margin-top:10px;">Car's info</span><br/>
                	Model: RS - X
                    Top Speed: 220km/h
                    <div style="width:100%;">
                            <a class="shoppingText" style="width:50%" href="#">Add to cart</a>|
                            <a class="shoppingText" style="width:40%;float:right" href="cartDetails.html">Details</a>
                        </div>
                </div>
           </div>
           <div id="item" style="width:20%;margin:2%;float:left;">
       	    	<img src="images/Racing Car.jpg" width="100%" height="100"/>
                <div class="item_info">
                	<span class="searchText" style="font-size:14px;margin-top:10px;">Car's info</span><br/>
                	Model: RS - X
                    Top Speed: 220km/h
                    <div style="width:100%;">
                            <a class="shoppingText" style="width:50%" href="#">Add to cart</a>|
                            <a class="shoppingText" style="width:40%;float:right" href="cartDetails.html">Details</a>
                        </div>
                </div>
           </div>
           <div id="item" style="width:20%;margin:2%;float:left;">
       	    	<img src="images/Racing Car.jpg" width="100%" height="100"/>                
                <div class="item_info">
                	<span class="searchText" style="font-size:14px;margin-top:10px;">Car's info</span><br/>
                	Model: RS - X
                    Top Speed: 220km/h
                    <div style="width:100%;">
                            <a class="shoppingText" style="width:50%" href="#">Add to cart</a>|
                            <a class="shoppingText" style="width:40%;float:right" href="cartDetails.html">Details</a>
                        </div>
                </div>
           </div>
      		</div>
		</div>

      	<div id="footer" class="navigation">
            <span style="margin-top:10px">Copyright by LocHT. All right reserved.</span>
        </div>
    </div>
</body>
</html>
